<%@include file="header.jsp"%>
<c:set var="t" value="true" />
<form action="Available" method=post>
				<c:if test="${param['submit']==t}" >
					<input type="hidden" name="ins" value="true" />
				</c:if>
				<c:if test="${param['reset']==t}" >
					<input type="hidden" name="ins" value="false" />
				</c:if>
	<table class="table table-striped">
		<tr>
			<th><fmt:message key="setup.period" /></th>
			<td><input type="text" name=period   id = "origin"  value="${param['period']}"
				size=15 maxlength=20>
					<span class="error">${errors.origin}</span>
			</td>
		</tr>
    	<tr>
			<th><fmt:message key="setup.stardate" /></th>
			<td colspan="3">
			<div id="ajaxError" style="width:200px"></div>
			<input type="Text" name="timestamp"  id = "origin2"
				value="${param['timestamp']}">
					<span class="error">${errors.origin2}</span>
			</td>
		</tr>
		<tr>
			<th><fmt:message key="setup.type" /></th>
				<td><select name="facilityType">
					<option value="meeting room"
						${ param['facilityType'] == "meeting room" ? 'selected="selected"' : ""  }>meeting room</option>
					<option value="class room"
						${ param['facilityType'] == "class room" ? 'selected="selected"' : ""  }>class room</option>
					<option value="discussion room"
						${ param['facilityType'] == "discussion room" ? 'selected="selected"' : ""  }>discussion room</option>
						<option value="multi purpose hall"
						${ param['facilityType'] == "multi purpose hall" ? 'selected="selected"' : ""  }>multi purpose hall</option>
					</select>
				</td>
		</tr>
		<tr>
			<td colspan="2" style="text-align:center">
			<div class="btn-group">
			<input class="btn btn-primary" type="submit" name="search" value="Search">
			<input class="btn btn-primary" type="reset" value="Reset">
			</div>
			</td>
		</tr>
	</table>
</form>
<table class="table table-striped">
	<tr>
	   <th><fmt:message key="label.booking.facilityID" /></th>
		<th><fmt:message key="label.facility.name" /></th>
		<th><fmt:message key="label.facility.description" /></th>
		<th><fmt:message key="label.facility.type" /></th>
		<th><fmt:message key="label.facility.capacity" /></th>
		<th>Action</th>
	</tr>
	<c:forEach var="facility" items="${searchlist}" varStatus="status">
		<tr>
	    	<td>${facility.facilityID}</td>
			<td>${facility.facilityName}</td>
			<td>${facility.description}</td>
			<td>${facility.facilityType}</td>
			<td>${facility.capacity}</td>
			<td><c:url var="updurl" scope="page" value="/Priority">
					<c:param name="facilityname" value="${facility.facilityName}" />
					<c:param name="type" value="${facility.facilityType}" />
					<c:param name="description" value="${facility.description}" />
					<c:param name="facilityID" value="${facility.facilityID}" />
					<c:param name="capacity" value="${facility.capacity}" />
					<c:param name="period" value="${param['period']}" />
					<c:param name="timestamp" value="${param['timestamp']}" />
					<c:param name="priority" value="${param['priority']}" />
				    <c:param name="userid" value="sysuser.getUser().getUserID()"/>
				    <c:param name="checkpriority" value="true"/>
							</c:url> <a  class="btn btn-primary" href="${updurl}"><fmt:message key="setup.book" /></a></td>
		</tr>
	</c:forEach>
</table>
<script type="text/javascript">
	$("#origin2").datepicker({
		format : 'yyyy-mm-dd',
		todayBtn : 'linked'
	}).on('changeDate',function(ev){
		//send ajax to backend.
		var dateStr = ev.date.format('yyyy-mm-dd');
		var origin = $("#origin").val();
		$.post('CheckHoliday',{dateString : dateStr, period : origin},function(data){
			$("#ajaxError").removeClass("alert").html("");
			if(data == "true"){
				$("#ajaxError").addClass("alert").append("This date is a holiday.");
			}
		});
	});
</script>
<%@include file="footer.jsp"%>